<template>
	<view class="container">
		<view class="panel">
			<view class="u-flex u-flex-items-center u-flex-between panel_row">
				<view class="name required">顾客姓名:</view>
				<view class="u-flex u-flex-items-center">
					<u--input v-model="name" fontSize="26rpx" inputAlign="right" :customStyle="{width:'360rpx',color:'#333333'}" placeholder="请输入顾客姓名" placeholderStyle="color:#999999;" border="none" :readonly="disabled" @blur="testRepeat"></u--input>
				</view>
			</view>
			<view class="u-flex u-flex-items-center u-flex-between panel_row">
				<view class="name required">顾客性别:</view>
				<view class="u-flex u-flex-items-center">
					<u-radio-group v-model="sex">
						<view class="sex_m">
							<u-radio label="男" :name="1"></u-radio>
						</view>
						<view class="sex_m">
							<u-radio label="女" :name="0"></u-radio>
						</view>
					</u-radio-group>
				</view>
			</view>
			<view class="u-flex u-flex-items-center u-flex-between panel_row">
				<view class="name">顾客手机号:</view>
				<view class="u-flex u-flex-items-center">
					<u--input v-model="mobile" fontSize="26rpx" inputAlign="right" :customStyle="{width:'360rpx',color:'#333333'}" placeholder="请填写顾客手机号" placeholderStyle="color:#999999;" border="none"></u--input>
				</view>
			</view>
			<view class="u-flex u-flex-items-center u-flex-between panel_row">
				<view class="name required">项目需求:</view>
				<view class="u-flex u-flex-items-center">
					<u--input v-model="remark" fontSize="26rpx" inputAlign="right" :customStyle="{width:'360rpx',color:'#333333'}" placeholder="请填写项目需求" placeholderStyle="color:#999999;" border="none"></u--input>
				</view>
			</view>
			<view class="u-flex u-flex-items-center u-flex-between panel_row">
				<view class="name required">邀约方式:</view>
				<view class="u-flex u-flex-items-center" @click="checkInvitationMethod">
					<u--input v-model="soureStr" fontSize="26rpx" inputAlign="right" :customStyle="{width:'360rpx',color:'#333333'}" placeholder="请选择邀约方式" placeholderStyle="color:#999999;" border="none" :readonly="true" suffixIcon="arrow-right"></u--input>
				</view>
			</view>
			<view class="u-flex u-flex-items-center u-flex-end panel_row" style="height: 120rpx;">
				<u-button size="large" text="添加" :hairline="false" :customStyle="{width:'320rpx',height:'80rpx',lineHeight:'80rpx',borderRadius:'40rpx',color:'#4179FF',background:'#FFFFFF',fontSize:'28rpx',border:'2rpx solid #4179FF'}" @click="addCustomers"></u-button>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getUniqueId,
		findDict,
		repeatCustomerList,
		saveMember
	} from '@/config/api.js';
	export default {
		data() {
			return {
				activityDayId: '', //活动日id
				activityStartTime: '', //活动开始时间
				storeId: '', //店面ID
				mId: '', //老客ID
				name: '', //名称
				sex: 0, //性别
				mobile: '', //手机号码
				remark: '', //项目需求
				soureList: [],
				soure: '', //邀约方式value
				soureStr: '', //邀约方式
				disabled: false, //为true的时候为老客邀约-不需要判重，为false的时候是新客录入-需要判重
			};
		},
		onLoad(options) {
			var that = this;
			let activityDayId = options.activityDayId;
			let activityStartTime = options.activityStartTime;
			let storeId = options.storeId;
			// 活动日ID
			if (uni.$u.test.isEmpty(activityDayId) === false) {
				that.activityDayId = activityDayId;
				that.activityStartTime = activityStartTime;
				that.storeId = storeId;
			}
			// 老客邀约逻辑，带入参数
			if (uni.$u.test.isEmpty(options.mId) === false) {
				let mId = options.mId;
				let chooseItem = JSON.parse(options.chooseItem);
				that.mId = mId;
				that.name = chooseItem.name;
				that.sex = chooseItem.gender;
				that.mobile = chooseItem.memberPhone;
				that.remark = chooseItem.demand;
			}
			// 判重重复顾客
			if (uni.$u.test.isEmpty(options.disabled) === false) {
				that.disabled = JSON.parse(options.disabled);
			}
			// 获取邀约方式
			that.getSoure();
		},
		methods: {
			// 获取邀约方式
			getSoure() {
				var that = this;
				let params = {
					type: 'soure',
					token: that.vuex_token
				};
				findDict(params).then(res => {
					that.soureList = res.data;
				}).catch(err => {
					console.log('findDict=', err);
				});
			},
			// 选择邀约方式
			checkInvitationMethod() {
				var that = this;
				let itemList = [];
				that.soureList.forEach(item => {
					itemList.push(item.name);
				});
				uni.showActionSheet({
					itemList: itemList,
					success: function(res) {
						that.soureStr = itemList[res.tapIndex];
						that.soureList.forEach(item => {
							if (item.name == that.soureStr) {
								that.soure = item.value;
								that.$forceUpdate();
							}
						});
					}
				});
			},
			testRepeat(e) {
				var that = this;
				// 判重
				let params = {
					token: that.vuex_token,
					storeId: that.storeId,
					activityDayId: that.activityDayId,
					name: that.name,
					memberPhone: that.mobile
				};
				repeatCustomerList(params).then(res => {
					let list = res.data;
					if (list.length > 0) {
						let customer = {
							id: 'jyxm',
							name: that.name,
							gender: that.sex,
							memberPhone: that.mobile,
							demand: that.remark,
							soure: that.soure
						};
						// 有重复顾客
						uni.$u.route({
							url: '/pages/repeat_customer/repeat_customer',
							params: {
								params: JSON.stringify(params),
								customer: JSON.stringify(customer)
							}
						}); //执行跳转
					}
				}).catch(err => {
					console.log('repeatCustomerList=', err);
				});
			},
			addCustomers() {
				var that = this;
				let pages = getCurrentPages();
				let prevPage = pages[pages.length - 3];
				if (uni.$u.test.isEmpty(that.name)) {
					return uni.$u.toast('请填写顾客姓名');
				}
				if (uni.$u.test.isEmpty(that.mobile) === false) {
					if (uni.$u.test.mobile(that.mobile) === false) {
						return uni.$u.toast('请填写正确的手机号');
					}
				}
				if (uni.$u.test.isEmpty(that.remark)) {
					return uni.$u.toast('请填写项目需求');
				}
				if (uni.$u.test.isEmpty(that.soure)) {
					return uni.$u.toast('请选择邀约方式');
				}
				// 是否老客邀约
				if (that.disabled === true) {
					that.submit(); //提交顾客
				} else {
					// 判重
					let params = {
						token: that.vuex_token,
						storeId: that.storeId,
						activityDayId: that.activityDayId,
						name: that.name,
						memberPhone: that.mobile
					};
					repeatCustomerList(params).then(res => {
						let list = res.data;
						if (list.length > 0) {
							let customer = {
								id: 'jyxm',
								name: that.name,
								gender: that.sex,
								memberPhone: that.mobile,
								demand: that.remark,
								soure: that.soure
							};
							// 有重复顾客
							uni.$u.route({
								url: '/pages/repeat_customer/repeat_customer',
								params: {
									params: JSON.stringify(params),
									customer: JSON.stringify(customer)
								}
							}); //执行跳转
						} else {
							// 没有重复顾客
							that.submit(); //提交顾客
						}
					}).catch(err => {
						console.log('repeatCustomerList=', err);
					});
				}
			},
			submit() {
				var that = this;
				let pages = getCurrentPages();
				let prevPage = pages[pages.length - 3];
				let params = {
					token: that.vuex_token,
					createBy: that.vuex_userId,
					mId: that.mId,
					sId: that.storeId,
					activityDayId: that.activityDayId,
					markTime: that.activityStartTime,
					name: that.name,
					gender: that.sex,
					memberPhone: that.mobile,
					demand: that.remark,
					soure: that.soure
				};
				saveMember(params).then(res => {
					uni.$u.toast(res.msg);
					let timeout = setTimeout(() => {
						clearTimeout(timeout);
						prevPage.$vm.getList('init');
						uni.$u.route({
							type: 'navigateBack',
							delta: 2
						});
					}, 1500);
				}).catch(err => {
					console.log('saveMember=', err);
				});
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #F4F4F4;

		.container {
			padding-top: 20rpx;

			.panel {
				width: 710rpx;
				background: #FFFFFF;
				border-radius: 12rpx;
				margin: 0 auto;

				.panel_row {
					height: 95rpx;
					border-bottom: 2rpx solid #E1E1E1;
					margin: 0 20rpx;

					.name {
						color: #333333;
						font-size: 28rpx;

						line-height: 32rpx;
					}

					.sex_m {
						margin-left: 40rpx;
					}
				}

				.panel_row:last-child {
					border-bottom: none;
				}
			}
		}
	}
</style>